<template>
  <common-view ref="commonView" :SearchSet="searchSet" :SearchForm="searchForm" :SearchData="searchData" :TableSet="tableSet" :Columns="columns" :DialogSet="dialogSet"
 :DialogFormData="dialogFormData" :DialogForm="dialogForm" :RequestController="requestController" :DataList="dataList" @handleQueryCallBack="handleQueryCallBack"
 @addCallBack="addCallBack" @updateCallBack="updateCallBack" @deleteCallBack="deleteCallBack"
  ></common-view>
</template>
<script>
import CommonView from "@/components/common/CommonView.vue";

export default {
  components: {
    CommonView,
  },
  data() {
    return {
      //页面组件配置
      //===================================================//
      //搜索框按钮
      //搜索框及搜索按钮是否展示
       searchSet:{
         searchButtenShow:true,
       },
      //搜索框配置及数据
       searchData: {
        g_name: "",
      },
      searchForm: [
        {
          type: "Input",
          label: "角色名称",
          prop: "g_name",
          width: "200px",
          placeholder: "角色名称...",
          enternative: this.handleQuery, //按下enter执行的函数
        },
      ],
      //表格相关配置
      tableSet: {
        selection: true, //是否显示多选框
        showKey: true, //显示索引列
        idColum: "g_id", //（id）主键列名称
      },
      //表格表头数据
      //Object.freeze 百度去理解 提升性能并且禁止对于该对象的属性进行修改（
      columns: Object.freeze([
        {
          sortable: true,
          attrs: {
            prop: "g_name",
            label: "角色名称",
            // width: "140",
            align: "center",
            // "show-overflow-tooltip": true,
          },
        },
        {
          //排序 若做了分页sortable:"custom"
          sortable: true,
          attrs: {
            prop: "g_create_time",
            label: "创建时间",
            // width: "140",
            align: "center",
            // "show-overflow-tooltip": true,
          },
        },
        {
          sortable: true,
          attrs: {
            prop: "g_memo",
            label: "备注",
            // width: "140",
            align: "center",
            // "show-overflow-tooltip": true,
          },
        },
      ]),
      //新增编辑弹出框相关配置
      dialogSet: {
        title: "角色信息",
        isEdit: false,
        dialogVisible: false,
      },
      //新增编辑相关信息
      dialogFormData: { g_name: "", g_memo: "" },
      //新增编辑form
      dialogForm: {
        labelWidth: "100px",
        inline: false,
        labelPosition: "right",
        size: "small",
        formItem: [
          {
            type: "text",
            label: "角色名称",
            width: "200px",
            prop: "g_name",
            size: "small",
            isDisabled: false,
            rules: [
              { required: true, message: "请输入角色名称", trigger: "blur" },
              {
                min: 2,
                max: 15,
                message: "长度在 2 到 15 个字符",
                trigger: "blur",
              },
            ],
          },
          {
            type: "text",
            label: "备注",
            width: "200px",
            prop: "g_memo",
            size: "small",
            isDisabled: false,
            rules: [],
          },
        ],
      },
      downloadLoading: false,
    dataList:[],
     
      //页面逻辑参数等
      //=======================================================//
      //选中的行
      requestController: "Group",
    };
  },
  mounted: function () {},
  methods: {
     handleQuery() {
      this.$refs.commonView.handleQuery();
    },
    //修正返回表格list数据(访问list返回成功回调)
    handleQueryCallBack(res) {
      this.dataList = res.bodyList;
    },
    ///新增回调
    addCallBack(res) {},
    //更新回调
    updateCallBack(res) {},
    //删除回调
    deleteCallBack(res) {},
    Export() {
      this.downloadLoading = true;
      // this.downloadLoading=false;
    },
  },
};
</script>
<style lang="scss">
.el-form-item {
  margin-bottom: 0px;
}
</style>
